<script setup>
import { useRouter } from 'vue-router';
import {useUserStore} from '@/stores/user'
import {ref} from 'vue'
import { showDialog , showNotify ,showConfirmDialog,showImagePreview} from 'vant';
// import { onMounted } from 'vue';
import { showSuccessToast, showFailToast } from 'vant';


// onMounted(() => {
//     console.log(userStore);
// })

const userStore = useUserStore()

const router = useRouter()

const fileList = ref([])

// function getImg(){
//     console.log(123);
// }

function outBtn() {
    // store.commit('setUserInfo', {})
    // console.log('退出');
    // userStore.setUserId('')
    // userStore.setUserState(false)

    window.localStorage.clear()

    router.push('/')
    showSuccessToast('退出成功')
}
function onClickRight() {
    router.push('/login')
}

function getMoney(){
    
    showDialog({
        message: '余额不足，点击确认去充值！',
        }).then(() => {
        // on close
        router.push('/money')
    });
}

function getNews(){
    showNotify({ type: 'primary', message: '无最新通知' ,duration:'2000'});
}

function getPersonal(){
    router.push('/personal')
}

function getFriend(){
    showConfirmDialog({
        message:
            '复制此链接邀请好友：http://121.89.205.189:3000/apidoc/#api-Pro-GetProCategoryBrandList',
    })
}

</script>

<template>
    <div class="box">
        <!-- <van-nav-bar 
            title="个人页" 
            right-text="登录" 
            :left-arrow="false" 
            @click-right="onClickRight" /> -->
            <header class="header">个人页</header>


            <!-- <van-uploader
                v-model="fileList" 
                multiple 
                :max-count="2"
                preview-size="130"
            /> -->

            <!-- <van-image
                @click="getImg"
                none
                round
                width="1.5rem"
                height="1.5rem"
                src="https://tupian.qqw21.com/article/UploadPic/2021-3/20213132143610585.jpg"
            /> -->

            <van-uploader
                v-model="fileList" 
                max-count="1"
                preview-size="130" 
            />

                <van-button @click="getMoney" type="primary" round >余额</van-button>
                <van-button @click="getNews" type="primary" round >消息</van-button>
                <van-button @click="getPersonal" type="primary" round >个人中心</van-button>
                <van-button @click="getFriend" type="primary" round >邀请好友</van-button>  
    
                        <van-button @click="onClickRight" type="primary" round>登录</van-button>
                  
                <van-button @click="outBtn" type="primary" round >退出</van-button>
            



    </div>
</template>


<style lang="scss" scoped>
.van-uploader{
    // display: flex;
    position: absolute;
    top: 80px;
    left: 122px;
}
.van-button{
    margin: 10px 20px;
    display: flex;
    top: 180px;
}

</style>